<template>
	<view class="add">
		<view class="tips"><text>请认真填写就诊人信息</text></view>
		<view class="line fristLine">
			<text class="name">关系</text>
			<text class="selType" @click="selRelationship">{{ relation }}</text>
			<text class="iconfont icon-xiangyou1"></text>
		</view>
		<view class="line">
			<text class="name">姓名</text>
			<input
				type="text"
				v-model="patientData.name"
				placeholder-class="placeholder"
				placeholder="请输入真实姓名"
			/>
		</view>
		<view class="line">
			<text class="name">证件类型</text>
			<text class="selType" @click="selType">{{ cardType }}</text>
			<text class="iconfont icon-xiangyou1"></text>
		</view>
		<view class="line">
			<text class="name">证件号码</text>
			<input
				type="text"
				v-model="patientData.cardNum"
				placeholder-class="placeholder"
				placeholder="请输入证件号码"
			/>
		</view>
		<view class="line">
			<text class="name">就诊卡号</text>
			<input
				type="text"
				v-model="patientData.visitNum"
				placeholder-class="placeholder"
				placeholder="请输入就诊卡号"
			/>
		</view>
		<view class="line">
			<text class="name">手机号码</text>
			<input
				type="text"
				v-model="patientData.phone"
				placeholder-class="placeholder"
				placeholder="请输入手机号码"
			/>
		</view>
		<view class="line">
			<text class="name">就诊人地址</text>
			<textarea
				auto-height
				v-model="patientData.address"
				style="width:400rpx;"
				placeholder-class="placeholder"
				placeholder="选填"
			></textarea>
		</view>
		<view class="line">
			<text class="name">设为默认就诊人</text>
			<switch class="setDefault" :checked="patientData.status === 0" />
		</view>
		<view class="tip">
			<text>
				初次添加就诊人请绑定本院就诊卡号，未持有本院就诊卡的患者需到本院自助机或窗口办理就诊卡后方可进行添加。
			</text>
		</view>
		<view @click="save" class="save"><text>保存</text></view>
		<view @click="del" class="del"><text>删除就诊人</text></view>
	</view>
</template>

<script setup>
import { ref, onBeforeMount, computed } from 'vue'
import { useLoginStore } from '@/store/loginStore.js'
import { updatePatient, delPatient } from '@/api/personApi.js'

const loginStore = useLoginStore()
const patientData = ref({})
onBeforeMount(() => {
	patientData.value = loginStore.editData
	console.log(patientData.value)
})
const selRelationship = () => {
	uni.showActionSheet({
		title: '请选择与本人关系',
		itemList: ['本人', '子女', '夫妻', '父母', '朋友'],
		success(res) {
			patientData.value.relationType = res.tapIndex
		}
	})
}
const selType = () => {
	uni.showActionSheet({
		title: '请选择证件类型',
		itemList: ['身份证', '护照', '港澳通行证'],
		success(res) {
			patientData.value.idcardType = res.tapIndex
		}
	})
}
const relation = computed(() => {
	return ['本人', '子女', '夫妻', '父母', '朋友'][
		patientData.value.relationType
	]
})
const cardType = computed(() => {
	return ['身份证', '护照', '港澳通行证'][patientData.value.idcardType]
})
const save = async () => {
	for (let k in patientData.value) {
		console.log(k)
		if (
			k != 'address' &&
			(patientData.value[k] === '' || patientData.value[k] === -1)
		) {
			uni.showToast({
				title: '信息填写错误',
				icon: 'error'
			})
			return
		}
	}
	uni.showLoading({
		title: '加载中'
	})
	let { data } = await updatePatient(patientData.value)
	if (data.code === 0) {
		uni.showToast({
			title: '保存成功',
			icon: 'success',
			success() {
				uni.navigateBack()
			}
		})
	} else {
		uni.showToast({
			title: '保存失败',
			icon: 'error'
		})
	}
}
const del = async () => {
	console.log(patientData.value.id)
	let { data } = await delPatient(patientData.value.id)
	if (data.code === 0) {
		uni.showToast({
			title: '删除成功',
			icon: 'success',
			success() {
				uni.navigateBack()
			}
		})
	} else {
		uni.showToast({
			title: '删除失败',
			icon: 'error'
		})
	}
}
</script>

<style lang="less" scoped>
.add {
	padding: 30rpx;
	font-size: 28rpx;
	color: #aaa;

	.tips {
		margin-bottom: 30rpx;
	}

	.fristLine {
		border-top: 1px solid #f2f2f2;
	}

	.line {
		min-height: 110rpx;
		display: flex;
		align-items: center;
		border-bottom: 1px solid #f2f2f2;

		.name {
			font-size: 30rpx;
			color: #333;
			width: 210rpx;
		}
		input,
		textarea,
		.selType {
			color: #333;
		}
		.placeholder {
			color: #d7d7d7;
			font-size: 28rpx;
			width: 400rpx;
		}

		.icon-xiangyou1 {
			margin-left: auto;
		}

		.setDefault {
			margin-left: auto;
			color: #006eff;
			transform: scale(0.7);
		}
	}

	.tip {
		margin: 30rpx 0;
		font-size: 24rpx;
		color: #aaa;
		background: #f7f8f8;
		line-height: 48rpx;
		padding: 10rpx 20rpx;
	}

	.save {
		width: 686rpx;
		height: 80rpx;
		line-height: 80rpx;
		text-align: center;
		color: #fff;
		background: #006eff;
		border-radius: 4px;
	}
	.del {
		margin-top: 30rpx;
		width: 686rpx;
		height: 80rpx;
		line-height: 80rpx;
		text-align: center;
		color: #006eff;
		background: #e4f0ff;
		border-radius: 4px;
	}
}
</style>
